<template>
  <div class="businessMask">
    <div class="businessDialog large">
      <div class="dialog-header" v-winmove>
        <span>{{ pageTitle }}</span>
      </div>
      <div class="dialog-body">
        <template-page :params="params" @getCheckedData="getCheckedData"></template-page>
      </div>
      <div class="dialog-footer right">
        <span class="businessButtonCancel" @click="confirm">确定</span>
        <span class="businessButtonCancel" @click="cancel">取消</span>
      </div>
    </div>
  </div>
</template>

<script>
import winmove from '@/directives/winmove'
import {pageShow} from "@/system/api/customPage";

export default {
  name: "TemplateWindow",
  directives: {
    winmove,
  },
  components: {
    TemplatePage: () => import('./templatePage')
  },
  data() {
    return {
      checkedList: [],
      pageTitle: null
    }
  },
  props: {
    params: {
      id: null, // 页面 id
      menuCode: null, // 页面编码
      multipleChoice: 0, // 0-单选 1-多选
      dialogTitle: null, // 标题
      deptId: null, // 部门 ID
      params: {},
      cellParams: {}, // 按钮传给表单参数
      businessInfo: {}, // 按钮传给表单后台参数
      serverParams: {} // 按钮传给后台参数
    },
  },
  async created() {
    if (this.params.dialogTitle) {
      this.pageTitle = this.params.dialogTitle
    } else {
      const detail = await pageShow({id: this.params.id})
      this.pageTitle = detail.info.text
    }
  },
  methods: {
    // 获取勾选数据
    getCheckedData(e) {
      this.checkedList = e
    },
    // 取消按钮
    cancel() {
      this.$emit('cancel', 'cancel')
    },
    // 确定按钮
    confirm() {
      if (this.checkedList.length === 0) {
        this.message('请选择数据', 3)
        return
      }
      this.$emit('confirm', this.checkedList)
    }
  },
}
</script>

<style lang="scss" scoped>
.businessMask .businessDialog .dialog-body {
  .businessPage-wrapper {
    height: 100%;
  }
}
</style>
